<template>
<el-row style="box-shadow: 2px 2px 2px #ccc">
  <el-col class="flex" :span="3"><img class="img1" src="../../assets/img/logo2.jpg" alt=""></el-col>
  <el-col :span="5" class="title">万通支付后台管理系统</el-col>
  <el-col :span="5" class="ipTime2" :offset="7">
    <div class="ipTime">您的登录IP:{{login.ip}}</div>
    <div class="ipTime">上次登录时间:{{dateformat(login.createTime)}}</div>
  </el-col>
  <el-col :span="4" >
    <!--<el-button @click="logout">btn</el-button>-->
    <el-dropdown>
      <span class="el-dropdown-link">
        您好： <span style="color: yellow">xwy</span><i class="el-icon-arrow-down el-icon--right"></i>
      </span>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item>余额：0.00</el-dropdown-item>
        <el-dropdown-item @click.native="logout">退出登录</el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>
  </el-col>
</el-row>

</template>

<script>
  import dateformat from '../../assets/js/dateformat'
  export default {
    data () {
      return {
        login: {},
        dateformat: dateformat
      }
    },
    created () {
      this.getLoginLogLast()
    },
    methods: {
      logout () {
        this.$confirm('您确定要退出该平台吗, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$api.logout().then(res => {
            if (res.code === '000000') {
              this.$message.success('退出成功')
              this.$router.push('/')
            }
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消退出'
          })
        })
      },
      getLoginLogLast () {
        this.$api.getLoginLogLast().then(res => {
          if (res.code === '000000') {
            this.login = res.data
          }
        })
      }
    }

  }
</script>

<style lang="less" scoped>
.el-row{
  height:70px;
  background-color: #fff;
  color: #000;
  line-height:70px;
}
  .title{
    font-size: 20px;
    text-align: left;
    padding-left: 10px;
  }
  .img1{
    width: 80px;
    height: 40px;
    margin: 15px 0;
    border-radius: 30px;
  }
  .flex{
  justify-content: flex-end;
  }
  .ipTime{
    line-height: 35px;
    font-size: 13px;
    text-align: left;
  }
.el-dropdown{
  height: 20px;
  line-height: 20px;
}
</style>
